{include file="public/header" /}
<body class="bgc">
<div class="header">
    <span class="layui-icon layui-icon-left" onclick="load_href('{:url(\'user/index\')}',2)"></span> 我的订单
</div>

<ul class="pro-list-nav">
    <li data-type="" class="{if !$Request.param.type}active{/if}">
        <div>全部</div>
        <p></p>
    </li>
    <li data-type="1" class="{if $Request.param.type == 1}active{/if}">
        <div>待付款</div>
        <p></p>
    </li>
    <li data-type="2" class="{if $Request.param.type == 2}active{/if}">
        <div>待发货</div>
        <p></p>
    </li>
    <li data-type="3" class="{if $Request.param.type == 3}active{/if}">
        <div>待收货</div>
        <p></p>
    </li>
    <li data-type="4" class="{if $Request.param.type == 4}active{/if}">
        <div>已完成</div>
        <p></p>
    </li>
</ul>

<ul class="my-order-list tpl_list">

</ul>
<script id="template" type="text/html">


    {{# for(var i=0;i < d.data.length ;i++){ }}
    <li>
        <p class="flex-layout">订单编号：{{d.data[i].sn}} <span>{{d.data[i].status}}</span></p>
        <a href="{:url('order/my_order_details')}?id={{d.data[i].id}}">
            <ul class="submit-pro-list">
                {{# for(var j=0;j < d.data[i].productsField.length;j++){ }}
                <li>
                    <p class="flex-center">
                        <img src="{{d.data[i].productsField[j].icon}}" alt="">
                    </p>
                    <div class="center">
                        <p class="multi">{{d.data[i].productsField[j].title}}</p>
                                            <p class="spec">{{d.data[i].productsField[j].sku_name}}</p>
                    </div>
                    <div class="rgt">
                        <p class="price">￥<span>{{d.data[i].productsField[j].vip_price}}</span></p>
                        <p>x{{d.data[i].productsField[j].num}}</p>
                    </div>
                </li>
                {{# } }}
            </ul>
        </a>
        <p class="order-price">实付款<span>￥{{d.data[i].real_amount}}</span></p>
        <div class="order-btn">

            {{# if(d.data[i].statusCode == 1){ }}
            <a href="javascript:;" class="clearOrder" data-id="{{d.data[i].id}}">取消订单</a>
            <a href="{:url('order/payment')}?id={{d.data[i].id}}" class="bc">立即付款</a>

            {{# }else if(d.data[i].statusCode == 3) { }}
            <a href="javascript:;" data-id="{{d.data[i].id}}" class="bc receipt">确认收货</a>

            {{# }else { }}

            {{# } }}

        </div>
    </li>
    {{# } }}

</script>
</body>
{include file="public/footer"/}
<script>
    $(function () {
        getFlow('{$Request.param.type?:""}', "{:url('order/getList')}");

        $('.pro-list-nav li').click(function () {
            $(".tpl_list").empty();
            getFlow($(this).attr('data-type'), "{:url('order/getList')}");
            $(this).addClass('active').siblings().removeClass('active')
        });

        $('.tpl_list').on('click', '.clearOrder', function () {
            const id = $(this).attr('data-id');
            edit('clear', id, '确认要取消订单吗？')
        }).on('click', '.receipt', function () {
            const id = $(this).attr('data-id');
            edit('receipt', id, '是否确认收货？')
        });

        function edit(type, id, msg) {
            layer.confirm(msg, {title: '请确认'}, function () {
                common.load()
                $.ajax({
                    type: 'POST',
                    url: '{:url("order/edit")}',
                    data: {type: type, id: id},
                    dataType: "json",
                    success: function (data) {
                        layer.closeAll;
                        layer.msg(data.msg);
                        if (data.code == 1) {
                            $(".tpl_list").empty();
                            getFlow($(".active").attr('data-type'), "{:url('order/getList')}");
                        }
                    }
                });
            });
        }
    })
</script>
</html>